<template>
	<div>
		<el-tabs v-model="current" tab-position="left" class="tab">
			<el-tab-pane name="0" label="pdf临时存储路径">
				<el-form ref="studyForm" :model="studyForm" :rules="studyRole" style="width: 80%; min-width: 800px" label-width="160px">
					<el-form-item label="pdf转图片临时文件路径" prop="localPath">
						<el-input v-model="studyForm.paramMap.localPath" autocomplete="off" placeholder="请输入内容"></el-input>
					</el-form-item>
				</el-form>
			</el-tab-pane>
		</el-tabs>
		<el-button type="primary" @click="onSubmit">保存</el-button>
	</div>
</template>

<script>
import request from "@/common/request"

export default {
	data() {
		return {
			current: "0",
			formData: {},
			couponForm: {
				bindCode: "COUPON",
				bindDetail: "",
				groupCode: "",
				id: "",
				paramMap: {
					url: "",
				},
			},
			studyForm: {
				bindCode: "STUDY",
				bindDetail: "",
				groupCode: "",
				id: "",
				paramMap: {
					localPath: "",
				},
			},
			couponRule: {
				"paramMap.url": [{ required: true, message: "请输入URL", trigger: "blur" }],
			},
			studyRole: {},
			tag: [
				{
					type: "primary",
					text: "例如 www.xxx.com ",
				},
			],
		}
	},
	created() {
		this.getData()
	},
	methods: {
		async getData() {
			const { data } = await request("get", "/system/configApi/list")
			const coupon = data.find(item => item.bindCode === "COUPON")
			const study = data.find(item => item.bindCode === "STUDY")
			console.log("coupon", coupon)
			if (coupon) {
				this.couponForm = {
					bindCode: "COUPON",
					bindDetail: coupon.bindDetail,
					groupCode: coupon.groupCode,
					id: coupon.id,
					paramMap: {
						url: coupon.paramMap.url,
					},
				}
			}
			if (study) {
				this.studyForm = {
					bindCode: "STUDY",
					bindDetail: study.bindDetail,
					groupCode: study.groupCode,
					id: study.id,
					paramMap: {
						localPath: study.paramMap.localPath,
					},
				}
			}
		},
		async onSubmit() {
			const refs = [this.$refs.studyForm]
			const formData = [this.studyForm][this.current]
			refs[this.current].validate(async valid => {
				if (valid) {
					formData.bindDetail = JSON.stringify(formData.paramMap)
					const { code, msg } = await request("post", "/system/configApi/edit", formData)
					if (code === 0) {
						this.$message.success("保存成功")
					} else {
						this.$message.error(msg)
					}
				}
			})
		},
	},
}
</script>

<style lang="scss" scoped>
.tab {
	display: flex;
	align-items: center;
}
</style>
